//
//  SigninView.swift
//  JLDiaryApp
//
//  Created by Jiang Chencheng on 2024/9/25.
//

import SwiftUI
import AlertToast

struct SigninView: View {
    
    @Environment(\.dismiss) var dismiss
    
    @EnvironmentObject var user: UserCenter
    
    @StateObject var viewModel = SigninViewModel()
    
    var body: some View {
        VStack{
            /// Title
            Text("Log in")
                .frame(maxWidth: .infinity, alignment: .leading)
                .foregroundColor(Color.white)
                .font(.title2)
                .fontWeight(.semibold)
                .padding()
            
            Group {
                
                // Email
                HStack {
                    Image(systemName: "envelope")
                        .frame(width: 20, height: 20)
                    TextField("", text: $viewModel.email, prompt: Text("Email").foregroundColor(.gray))
                }
                .modifier(JLCapsuleTextFieldModifier())
                .padding(.horizontal)
                
                // Password
                HStack {
                    Image(systemName: "lock")
                        .frame(width: 20, height: 20)
                    SecureField("", text: $viewModel.password, prompt: Text("Password").foregroundColor(.gray))
                        .textContentType(.password)
                }
                .modifier(JLCapsuleTextFieldModifier())
                .padding(.horizontal)
                
            }
            

            Spacer()
            
            
            Group{
                
                /// Signin Button
                Button {
                    viewModel.signin()
                } label: {
                    Text("Log in")
                }
                .buttonStyle(JLMainButtonStyle())
                .padding(.horizontal)
               
            
                /// Forgot Password
                Button {
                    
                } label: {
                    Text("Forgot your password?")
                        .foregroundStyle(.white)
                }
                .padding(.bottom)
                
            }
            
        }
        .background(Color("BackgroundColor"))
        .navigationBarBackButtonHidden()
        .toolbar {
            ToolbarItem(placement: .topBarLeading) {
                Button(action: {
                    dismiss()
                }, label: {
                    HStack(spacing: 5) {
                        Image(systemName: "chevron.backward")
                            .font(.callout.bold())
                            .foregroundStyle(.white)
                    }
                })
            }
        }
        .toast(isPresenting: $viewModel.isLoading) {
            AlertToast(displayMode: .alert, type: .loading)
        }
        .toast(isPresenting: $viewModel.isError) {
            AlertToast(displayMode: .alert, type: .regular, title: viewModel.toastTitle)
        }
        .onAppear {
            viewModel.setup(user)
        }
    }
}

#Preview {
    SigninView()
}
